<template>
    <div style="height:64px;width:64px" :style="{backgroundColor:obj.color}"
         class="flexCenterCenter flex-column flex-no-zoom">
        <img :src="obj.img"
             class="img-fluid mx-auto mb-4" alt="">
        <div>{{obj.title}}</div>
    </div>
</template>

<script>
    export default {
        name: "accident-main-img",
        props: {type: ""},
       data(){
            return {
                obj:{},
            }
       },
        mounted() {
            // console.log('this.type')
            // console.log(this.type);
            if(this.type == 0){
                this.obj = {
                    title:'拥堵',
                    img:require('../assets/img/emergencyDuty/policeSituation/iconJam.png'),
                    color:"#d67833",
                }
            }else if(this.type == 1){
                this.obj = {
                    title:'事故',
                    img:require('../assets/img/emergencyDuty/policeSituation/iconDoubleCarAccident.png'),
                    color:"#d63343",
                }
            }else if(this.type == 2){ //严重事故
                this.obj = {
                    title:'事故',
                    img:require('../assets/img/emergencyDuty/policeSituation/iconOneCarAccident.png'),
                    color:"#d63343",
                }
            }

        }
    }
</script>

<style scoped>

</style>
